<script lang="ts" setup>
import paymentHistoryCom from '@/compontent/paymentHistoryCom.vue';
import { examinePaymentHistoryReq, getPaymentWaitExamine } from '@/axios/case/paymentHistoryReq';
import { Case } from '@/types/response/case';
import PaymentHistory from '@/types/response/paymentHistory';
import { reactive, Ref, ref } from 'vue';
import useFileStore from '@/stores/fileStore';
import useUserStore from '@/stores/userStore';
let fileStore = useFileStore();
let userStore = useUserStore();
let paymentHistorys: Ref<PaymentHistory[]> = ref([]);//待审批还款记录列表

//获得待审批的还款记录
getPaymentWaitExamine(userStore.userId).then(res => {
    res.forEach(item => {
        paymentHistorys.value.push(item);
    })
    console.log("获得待审批的还款记录",paymentHistorys.value)
})
</script>
<template>
    <!--还款情况-->
    <el-card class="cardContainer" :body-style="{ height: 'calc(100% - 78px)' }" shadow="always">
        <template #header>
            待审批还款情况
        </template>
        <el-scrollbar max-height="400px">
            <paymentHistoryCom :allow-examine="true" :allow-look-detail="true" :cases="[]"
                :payment-history="paymentHistorys">
            </paymentHistoryCom>
        </el-scrollbar>
    </el-card>

</template>
<style lang="scss">
.cardContainer {
    height: 90%;

    .selectContainer {
        width: 100%;
        height: 40px;
        display: flex;
        flex-direction: row;
        justify-content: start;
        margin-bottom: 20px;

        .selectItem {
            display: flex;
            align-items: center;
            white-space: nowrap;
            width: 250px;
            margin-right: 20px;

            span {
                width: fit-content;
                margin-right: 10px;
            }
        }
    }

    .tableContainer {
        height: calc(100% - 70px);
    }
}
</style>